<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>房屋租售</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <style type="text/css">
        .icon {
            width: 1em;
            height: 1em;
            vertical-align: -0.15em;
            fill: currentColor;
            overflow: hidden;
        }
        img{
            max-width: 100px !important;
            height:100px !important;
        }
        .mui-content span{
            line-height: 40px !important;
        }
    </style>
    <!--<script src="__TMPL__/public/assets/wuye/js/mui.min.js"></script>-->
    <!--标准mui.css-->
    <link rel="stylesheet" href="__TMPL__/public/assets/wuye/css/mui.min.css">
    <!--App自定义的css-->
    <link rel="stylesheet" type="text/css" href="__TMPL__/public/assets/wuye/css/app.css"/>
    <script src="__TMPL__/public/assets/wuye/js/iconfont.js"></script>
    <link href="__TMPL__/public/assets/wuye/css/mui.picker.css" rel="stylesheet" />
    <link href="__TMPL__/public/assets/wuye/css/mui.poppicker.css" rel="stylesheet" />
    <script src="__TMPL__/public/assets/wuye/js/mui.min.js"></script>
    <script src="__TMPL__/public/assets/wuye/js/iconfont.js"></script>
    <script src="__TMPL__/public/assets/wuye/js/mui.picker.js"></script>
    <script src="__TMPL__/public/assets/wuye/js/mui.poppicker.js"></script>
    <script src="__TMPL__/public/assets/wuye/js/mui.zoom.js"></script>
    <script src="__TMPL__/public/assets/wuye/js/mui.previewimage.js"></script>
    <script src="__TMPL__/public/assets//js/jquery-1.10.2.min.js"></script>
    <style>
        .mui-bar .mui-segmented-control{
            width: 65%;
        }
        .mui-segmented-control .mui-control-item.mui-active{
            background-color: orange;
        }
        .mui-segmented-control .mui-control-item{
            border-color: orange;
            border-left: 1px solid orange;
        }
        .mui-segmented-control{
            border: 1px solid orange;
        }
        .mui-segmented-control .mui-control-item{
            line-height: 30px;
        }
        .mui-bar .mui-title{
            left: 30px;
        }
    </style>
</head>

<body>

<header class="mui-bar mui-bar-nav">
    <a class="mui-icon mui-icon-left-nav mui-pull-left" href="javascript:window.history.go(-1);"></a>
    <div id="segmentedControl" class="mui-title mui-segmented-control">
        <a class="mui-control-item mui-active" href="#item1">全部</a>
        <a class="mui-control-item" href="#item2">出租</a>
        <a class="mui-control-item" href="#item3">出售</a>
    </div>
    <a class="mui-icon  mui-pull-right" style="font-size: 16px;padding-top: 0px;" href="#picture">
        <i class="mui-icon mui-icon-compose"></i>发布
    </a>
</header>
{:widget('Wuye/nav')}
<div class="mui-content">
    <div>
        <div id="item1" class="mui-control-content mui-active">
            <ul class="mui-table-view">
                {:widget('Wuye/lease', ['cateName' => '房屋租赁'])}
                <volist name="rental" id="voRental">
                    <li class="mui-table-view-cell mui-media">
                        <a href="leasedetail?Rid={$voRental.id|default=''}&id=">
                            <img class="mui-media-object mui-pull-left" src="__TMPL__/public/assets/wuye/images/{$voRental.type}.jpg">

                            <div class="mui-media-body">
                                <span>{$voRental.biaoti|default=''}</span>
                                <switch name="$voRental.type" >
                                    <case value="chushou">
                                        <p class="mui-ellipsis" style="font-weight: 600;margin-bottom: 5px;">个人房源&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<if condition="$voRental.type eq 'chushou'">出售<else />租赁</if></p>
                                        <p class="mui-ellipsis"  style="color: orangered">{$voRental.jiage|default=''}&nbsp;/&nbsp;套</p>
                                        <p class="mui-ellipsis">发布时间：<?php echo date('Y-m-d',$voRental['addtime'])?></p>
                                    </case>
                                    <case value="chuzu">
                                        <p class="mui-ellipsis" style="font-weight: 600;margin-bottom: 5px;">个人房源&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<if condition="$voRental.type eq 'chushou'">出售<else />租赁</if></p>
                                        <p class="mui-ellipsis"  style="color: orangered">{$voRental.jiage|default=''}&nbsp;/&nbsp;月</p>
                                        <p class="mui-ellipsis">发布时间：<?php echo date('Y-m-d',$voRental['addtime'])?></p>
                                    </case>
                                </switch>

                            </div>
                        </a>
                    </li>
                </volist>
            </ul>
        </div>
        <div id="item2" class="mui-control-content">
            <ul class="mui-table-view">
                {:widget('Wuye/lease', ['cateName' => '房屋租赁'])}
                <volist name="chuzu" id="vochuzu">
                    <li class="mui-table-view-cell mui-media">
                        <a href="leasedetail?Rid={$vochuzu.id|default=''}&id=">
                            <img class="mui-media-object mui-pull-left" src="__TMPL__/public/assets/wuye/images/{$vochuzu.type}.jpg">

                            <div class="mui-media-body">
                                <span>{$vochuzu.biaoti|default=''}</span>
                                <switch name="$vochuzu.type" >
                                    <case value="chushou">
                                        <p class="mui-ellipsis" style="font-weight: 600;margin-bottom: 5px;">个人房源&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<if condition="$vochuzu.type eq 'chushou'">出售<else />租赁</if></p>
                                        <p class="mui-ellipsis"  style="color: orangered">{$vochuzu.jiage|default=''}&nbsp;/&nbsp;套</p>
                                        <p class="mui-ellipsis">发布时间：<?php echo date('Y-m-d',$vochuzu['addtime'])?></p>
                                    </case>
                                    <case value="chuzu">
                                        <p class="mui-ellipsis" style="font-weight: 600;margin-bottom: 5px;">个人房源&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<if condition="$vochuzu.type eq 'chushou'">出售<else />租赁</if></p>
                                        <p class="mui-ellipsis"  style="color: orangered">{$vochuzu.jiage|default=''}&nbsp;/&nbsp;月</p>
                                        <p class="mui-ellipsis">发布时间：<?php echo date('Y-m-d',$vochuzu['addtime'])?></p>
                                    </case>
                                </switch>

                            </div>
                        </a>
                    </li>
                </volist>
            </ul>
        </div>
        <div id="item3" class="mui-control-content">
            <ul class="mui-table-view">
                {:widget('Wuye/lease', ['cateName' => '房屋租赁'])}
                <volist name="chushou" id="vochushou">
                    <li class="mui-table-view-cell mui-media">
                        <a href="leasedetail?Rid={$vochushou.id|default=''}&id=">
                            <img class="mui-media-object mui-pull-left" src="__TMPL__/public/assets/wuye/images/{$vochushou.type}.jpg">

                            <div class="mui-media-body">
                                <span>{$vochushou.biaoti|default=''}</span>
                                <switch name="$vochushou.type" >
                                    <case value="chushou">
                                        <p class="mui-ellipsis" style="font-weight: 600;margin-bottom: 5px;">个人房源&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<if condition="$vochushou.type eq 'chushou'">出售<else />租赁</if></p>
                                        <p class="mui-ellipsis"  style="color: orangered">{$vochushou.jiage|default=''}&nbsp;/&nbsp;套</p>
                                        <p class="mui-ellipsis">发布时间：<?php echo date('Y-m-d',$vochushou['addtime'])?></p>
                                    </case>
                                    <case value="chuzu">
                                        <p class="mui-ellipsis" style="font-weight: 600;margin-bottom: 5px;">个人房源&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<if condition="$vochushou.type eq 'chushou'">出售<else />租赁</if></p>
                                        <p class="mui-ellipsis"  style="color: orangered">{$vochushou.jiage|default=''}&nbsp;/&nbsp;月</p>
                                        <p class="mui-ellipsis">发布时间：<?php echo date('Y-m-d',$vochushou['addtime'])?></p>
                                    </case>
                                </switch>

                            </div>
                        </a>
                    </li>
                </volist>
            </ul>
        </div>
    </div>

</div>
<div id="picture" class="mui-popover mui-popover-action mui-popover-bottom">
    <ul class="mui-table-view">
        <li class="mui-table-view-cell">
            <a href="#" style="color: #0b0b0b">租赁</a>
        </li>
        <li class="mui-table-view-cell">
            <a href="#" style="color: #0b0b0b">出售</a>
        </li>
    </ul>
    <ul class="mui-table-view">
        <li class="mui-table-view-cell">
            <a href="#picture"><b>取消</b></a>
        </li>
    </ul>
</div>
</body>
<script>
    mui.init({
        swipeBack:true //启用右滑关闭功能
    });
    var gallery = mui('.mui-slider');
    gallery.slider({
        interval:3000//自动轮播周期，若为0则不自动播放，默认为0；
    });
    var info = document.getElementById("info");
    mui('body').on('tap', '.mui-popover-action li>a', function() {
        var a = this,
            parent;
        //根据点击按钮，反推当前是哪个actionsheet
        for (parent = a.parentNode; parent != document.body; parent = parent.parentNode) {
            if (parent.classList.contains('mui-popover-action')) {
                break;
            }
        }
        //关闭actionsheet
        mui('#' + parent.id).popover('toggle');
        if(a.innerHTML == '租赁'){
            console.log(a.innerHTML);
            window.location.href = "{:url('wuye/rental1')}";
        }else if(a.innerHTML == '出售'){
            window.location.href = "{:url('wuye/rental')}";
        }

    });
    mui('body').on('tap','a',function(){document.location.href=this.href;});
</script>
</html>